<template>
    <div style="width: 100vw;height: 100vh;background: #fff;">
        <div
            style="
                font-size: 14px;
                display: flex;
                background-color: #0f0f1e;
                overflow: auto;
                justify-content: space-between;
            "
        ></div>
        
        <div class="login-container m-auto pt-30 rounded5">
            <div class="form m-auto text-center">
                <p class="font-md9 pt-10">登录</p>
                <el-form ref="form" :model="formData">
                    <el-form-item prop="username">
                        <el-input placeholder="请输入用户名" v-model="formData.username" />
                    </el-form-item>
                    <el-form-item prop="password">
                        <el-input
                            v-model="formData.password"
                            type="password"
                            placeholder="请输入密码"
                            show-password
                        />
                    </el-form-item>
                    <el-form-item class="pb-30">
                        <el-button type="primary" style="width: 350px" @click="onSubmit">
                            登录
                        </el-button>
                    </el-form-item>
                </el-form>
            </div>
        </div>
    </div>
</template>
<script>
import { mapActions } from 'vuex';

export default {
    name: 'Login',
    data() {
        return {
            formData: {
                username: '',
                password: '',
                ip: '',
            },
        };
    },
    methods: {
        // 获取登录接口
        // ...mapActions('user', ['loginAdmin']),
        ...mapActions('user', ['loginAdmin']),
        async onSubmit() {
            this.loginAdmin(this.formData); // this.$store.dispatch('loginAdmin', this.formData);
        },
    },
};
</script>
<style lang="scss" scoped>

.login-container {
    width: 500px;
    overflow: hidden;
    margin-top: 200px;
    box-shadow: 0px 1px 2px 1px #999;

    .form {
        .el-input {
            width: 350px;
            height: 44px;
            .el-input__inner {
                background: #f4f5fb;
            }
        }
    }
}
</style>
